<template>
	<view class="projectDetailsContent ff-margin-left-12 ff-font-14 ff-margin-right-12">
		<view class="ff-bg-fff ff-margin-bottom-10 ff-border-radius-10 ff-padding-10">
			<view class="projectDetailsContent-title ff-font-16 ff-font-weight-600 ff-color-blue ff-border-radius-5">需求详情</view>
			<view class="projectDetailsContent-info ff-margin-top-15">
				<view class="projectDetailsContent-info-box">
					<view class="ff-padding-left-5 ff-margin-right-15 ff-font-14 ff-line-height-1-3">
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">需求类别</view>
							<view class="ff-color-222">评估</view>
						</view>
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">单位类型</view>
							<view class="ff-color-222">{{ projectDetailsInfo.companyTypeName }}</view>
						</view>
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">项目类型</view>
							<view class="ff-color-222">{{ projectDetailsInfo.assessProjectTypeName }}</view>
						</view>
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">项目预算(元)</view>
							<view class="ff-color-222">{{ projectDetailsInfo.assessProjectBudget }}</view>
						</view>
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">建筑面积(m²)</view>
							<view class="ff-color-222">{{ projectDetailsInfo.assessProjectArea }}</view>
						</view>
						<view class="ff-margin-bottom-16 ff-align-items-one">
							<view class="projectDetailsContent-info-box-left">评估地址</view>
							<view class="projectDetailsContent-info-box-right ff-color-222">{{ projectDetailsInfo.assessAddr }}</view>
						</view>
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">联 系 人</view>
							<view class="ff-color-222">{{ projectDetailsInfo.assessProjectLink }}</view>
						</view>
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">联系电话</view>
							<view class="ff-color-222">{{ projectDetailsInfo.assessProjectPhone }}</view>
						</view>
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">消防安全管理人</view>
							<view class="ff-color-222">{{ projectDetailsInfo.fireManageName }}&nbsp;&nbsp;{{ projectDetailsInfo.fireManagePhone }}</view>
						</view>
						<view class="ff-flex ff-margin-bottom-16">
							<view class="projectDetailsContent-info-box-left">消防安全职能部门</view>
							<view class="ff-color-222">{{ projectDetailsInfo.fireSafetyDepartment }}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="projectDetailsContent-table ff-padding-bottom-15" v-if="projectDetailsInfo.facilities.length> 0">
			<view class="ff-bg-fff ff-padding-10 ff-border-radius-10 ff-margin-bottom-10 ff-bg-fff">
				<view class="projectDetailsContent-title ff-font-16 ff-font-weight-600 ff-color-blue ff-border-radius-5 ff-margin-bottom-15">主要消防设施</view>
				<view class="projectDetailsContent-tableBox" v-for="(item, index) of projectDetailsInfo.facilities" :key="index">
					<view class="ff-margin-bottom-12">{{ index + 1 }}. {{ item.facilitiesTypeName }}</view>
				</view>
			</view>
		</view>
		<view class="projectDetailsContent-but" v-if="projectDetailsInfo.assessStatus == 0 || projectDetailsInfo.assessStatus == 1"><u-button shape="circle" type="primary" @click="defineSubmitk(projectDetailsInfo.assessId)">取消发布</u-button></view>
		<u-toast ref="uToast" />
		<f-loading ref="loading" />
		<u-modal
			v-model="locationModal"
			title="取消发布"
			show-cancel-button="true"
			@confirm="unpublishConfirm"
			cancel-text="我再想想"
			confirm-text="确定取消"
			:content-style="{ 'line-height': '1.5' }"
			content="请确认是否取消该项目的发布？"
		/>
	</view>
</template>

<script>
export default {
	name: 'projectDetailsContent',
	props: ['projectDetailsInfo'],
	data() {
		return {
			locationModal: false, // 取消发布的弹框显/隐
			assessId: '' // 项目的id
		};
	},
	methods: {
		// 取消发布
		defineSubmitk(assessId) {
			this.locationModal = true;
			this.assessId = assessId;
		},
		// 取消该项目的发布
		async unpublishConfirm() {
			this.$refs.loading.openLoading('提交中···');
			const data = await this.$http.post({ url: `/bsAssessProjectInfo/del/${this.assessId}` });
			// console.log('取消发布效果返回的数据----', data);
			if (data.code == 200) {
				this.$refs.uToast.show({
					title: data.msg,
					type: 'success'
				});
				let that = this
				setTimeout(() => {
					that.$pageJump.reLaunch('/pages/assessment/company/Company');
				}, 500)
				
			} else {
				this.$refs.uToast.show({
					title: data.msg,
					type: 'error'
				});
			}
			this.$refs.loading.closeLoading();
		}
	}
};
</script>

<style lang="scss" scoped>
.projectDetailsContent {
	&-title {
		background: linear-gradient(to right, #e5eeff, #ffffff);
		padding: 24rpx 20rpx 20rpx;
	}
	&-info {
		&-box {
			&-left {
				width: 241rpx;
				margin-right: 37rpx;
				color: #a6a6a6;
			}
			&-right {
				flex: 1;
			}
		}
	}
	&-table {
		&-box {
			margin-bottom: 50rpx;
			.ff-flex {
				padding: 24rpx 58rpx;
				.table-left-title {
					width: 70%;
					margin-right: 10%;
				}
				.table-left {
					width: 70%;
					margin-right: 10%;
					color: #5c5f65;
				}
				.table-right {
					flex: 1;
				}
			}
		}
	}
	.projectDetailsContent-tableBox:last-child view {
		margin-bottom: 0;
	}
	&-table .ff-flex:nth-child(odd) {
		background-color: #f8f8f8;
	}
	&-but {
		margin: 60rpx 5% 100rpx;
		width: 90%;
	}
}
</style>
